<template>
  <div class="shangjia">
    <div class="bg"></div>
    <div class="container">
      <p class="title">欢迎加入彩虹捕手大家庭</p>
      <p class="subtitle">商家入驻</p>
      <div class="hr">
        <img
          src="//13439588.s61i.faiusr.com/4/AD0I5KS0BhAEGAAg2uW9xwUo1sbAhgQwOzgZ.png.webp"
          alt=""
        />
      </div>
      <div class="main">
        <div>
          <p>注册</p>
          <p>入驻商家注册申请彩虹捕手商家账号</p>
          <div>
            <img
              src="../assets/new/微信图片_20210527204652.png"
              alt=""
              class="newimg"
            />
          </div>
        </div>
        <div>
          <p>审核</p>
          <p>彩虹捕手客服审核商家资料</p>
          <div>
            <img
              src="../assets/new/微信图片_20210527204655.png"
              alt=""
              class="newimg"
            />
          </div>
        </div>
        <div>
          <p>开通</p>
          <p>审核通过之后，在线缴费，开通店铺</p>
          <div>
            <img
              src="../assets/new/微信图片_20210527204658.png"
              alt=""
              class="newimg"
            />
          </div>
        </div>
      </div>
      <div class="form">
        <p>在线入驻</p>
        <span class="title">申请人</span><br />
        <input type="text" /><span class="icon">*</span><br />
        <span class="title">联系电话</span><br />
        <input type="text" /><span class="icon">*</span><br />
        <!-- <span class="title">入驻类型</span><br />
        <label><input type="checkbox" />轮胎</label>
        <label><input type="checkbox" />汽车配件</label>
        <label><input type="checkbox" />汽车配饰</label>
        <label><input type="checkbox" />其他</label><br /> -->
        <span class="title">企业简介</span><br />
        <textarea type="text" /><span class="icon iconts">*</span><br />
        <span class="title">商家资质</span><br />
        <input
          type="button"
          value="选择文件"
        /><span class="tips">文件大小不超过1M</span><span class="icon">*</span><br />
        <!-- <span class="title">验证码</span><br />
        <input
          type="text"
          class="yzm"
        /><img
          src="https://icpedi.yswebportal.cc/validateCode.jsp?97&vCodeId=5323"
          alt=""
          width="90px"
          style="margin-right:16px"
        /><span>换一张</span><span class="icon">*</span><br /> -->
        <button
          class="btn"
          @click="logoBtn"
        >提交</button>
      </div>
      <div class="info">
        <p>入驻须知</p>
        <p>请各商家在入驻前一定要详细阅读招商细则及要求</p>
        <div class="card">
          <div class="item">
            <a>
              <img
                src="//1.s140i.faiusr.com/2/AIwBCAAQAhgAINWr6dcFKNe8_7IGMIAPOIAK!640x640.jpg"
                alt=""
                width="100%"
              />
            </a>
            <div class="details">
              <div class="d1">彩虹捕手商城入驻流程详细说明</div>
              <div class="d2">
                1.品牌：彩虹捕手商城的重点招募品牌、您也可以推荐优质品牌给彩虹捕手商城，部分类目不限定品牌招商 <br>
                2.企业：合法登记的企业用户，并且能够提供彩虹捕手商城入驻要求的所有相关文件，不接受个体工商户、非中国大陆企业<br>
                3.资质要求详见：《彩虹捕手商城开放平台招商基础资质标准》及各类目资质标准<br>
                4.(1)填写店铺信息，包含店铺类型、经营类目和品牌。提交公司和类目品牌相关资质。(2)选择您希望使用的店铺名称和域名。<br>
                (3)签署合同提交入驻申请后进入审核流程。平台会在7个工作日内将审核结果以邮件形式发送至您在入驻联系人信息中填写的邮箱。

              </div>
            </div>
          </div>
          <div class="item">
            <a>
              <img
                src="//1.s140i.faiusr.com/2/AIwBCAAQAhgAINSr6dcFKMzCr_0CMIAPOK0J!640x640.jpg"
                alt=""
                width="100%"
              />
            </a>
            <div class="details">
              <div class="d1">彩虹捕手商城入驻联系人信息</div>
              <div class="d2">
                请发送邮件至sitengw@uci.edu,邮件内请包括：<br>
                1.详细信息（联系人，联系地址，联系电话) <br>
                2.公司简介（公司简介、公司网址、注册资本、供应商级别 “ 厂商、国代、一级代理、二级代理、其他 ” 、所销售品。）<br>
                3.是否能开增值税发票。 “ 厂商、国代、一级代理、二级代理、其他 ” 、所销售品。

              </div>
            </div>
          </div>
          <div class="item">
            <a>
              <img
                src="//1.s140i.faiusr.com/2/AIwBCAAQAhgAINSr6dcFKOLRlQUwgA84gAo!640x640.jpg"
                alt=""
                width="100%"
              />
            </a>
            <div class="details">
              <div class="d1">彩虹捕手商城入驻注意事项</div>
              <div class="d2">
                1.如果已在彩虹捕手商城开通过店铺，不能使用卖家入驻系统再开通新店铺。<br>
                2.如果卖家已在彩虹捕手开通过店铺或者正在入驻审核流程中，则无法使用卖家入驻系统。您可通过卖家后台申请开通新店铺。<br>
                3.商品注册证信息是以中国商标网查询结果为准，具体请参阅：http://www.saic.gov.cn/sbw1/sbcx/sbcx.html. 如果商标网信息未及时更新，请贵公司提供由商标局开具的商标转让、变更、续展证明等信息，以便平台进行核实。<br>
                4.关于如何获取银行联行号:卖家可向结算账号开户支行询问贵司开户银行的12位联行号编码。<br>
                5.关于三证合一审核要求:卖家需将三证合一证件分别上传至营业执照、税务登记证和组织机构代码证对应入口，如提供复印件需要加盖入驻公司公章

              </div>
            </div>
          </div>
          <div class="item">
            <a>
              <img
                src="//1.s140i.faiusr.com/2/AIwBCAAQAhgAIJr17NUFKMHkwcsBMIAPOIAK!640x640.jpg"
                alt=""
                width="100%"
              />
            </a>
            <div class="details">
              <div class="d1">彩虹捕手商城招商方向</div>
              <div class="d2">
                本标准适用于数码产品、配件品牌卖家<br>
                1.平台开放平台暂未授权任何机构进行代理招商服务，入驻申请流程及相关的收费说明均以平台开放平台官方招商页面为准。<br>
                2.平台店铺类型及相关要求: 旗舰店，卖家以自有品牌（商标为R或TM状态，专卖店，卖家持他人品牌（商标为R或TM状态）授权文件在平台开放平台开设的店铺。开店主体必须是品牌（商标）权利人或持有权利人出具的开设平台开放平台旗舰店排他性授权文件的被授权企业。<br>
                3.各店铺命名详细说明，请见《平台开放平台卖家店铺命名规则》

              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <FooterSub />
  </div>
</template>

<script>
export default {
  data () {
    return {};
  },
  methods: {
    logoBtn () {
      console.log(123)
      // 成功通知
      // this.$notify('提交成功,正在审核');
      this.$toast('提交成功,正在审核');
    }
  }
};
</script>

<style lang="scss" scoped>
$fc: #ff6637;
.newimg {
  width: 260px;
  height: 160px;
}
.shangjia {
  .bg {
    width: 100%;
    height: 450px;
    background: url("../assets/swiper/2.png") no-repeat;
    background-position-x: center;
  }
  .container {
    margin-bottom: 16px;
    .title {
      color: #303030;
      font-size: 22px;
      margin-top: 80px;
      text-align: center;
    }
    .subtitle {
      color: #888888;
      font-size: 16px;
      margin-top: 40px;
      text-align: center;
    }
    .hr {
      text-align: center;
      margin-top: 20px;
    }
    .main {
      display: flex;
      justify-content: space-around;
      text-align: center;
      p:first-child {
        margin-top: 40px;
        color: #232323;
        font-size: 22px;
        & + p {
          margin-top: 30px;
          color: rgb(86, 86, 86);
          font-size: 14px;
        }
      }
      img {
        margin: 80px 0;
        border-radius: 2px;
      }
    }
    .form {
      padding: 0 50px;
      p {
        color: #666;
        font-size: 14px;
        font-weight: 700;
        text-align: center;
        margin: 10px 0;
      }
      input[type="text"],
      textarea {
        width: 1000px;
      }
      input[type="text"] {
        height: 36px;
        border-radius: 5px;
        border: 1px solid #dadada;
        box-sizing: border-box;
      }
      input[type="text"]:focus {
        border: 1px solid #000;
      }
      textarea {
        height: 100px;
        resize: none;
      }
      .title {
        font-size: 14px;
        color: #666;
        font-weight: 700;
        display: inline-block;
        padding: 10px 0;
        margin-top: 0;
      }
      .icon {
        color: #ff004f;
        margin-left: 36px;
      }
      .iconts {
        display: inline-block;
        margin-top: 50px;
      }
      .yzm {
        width: 200px !important;
        margin-right: 30px;
      }
      .tips {
        margin: 0 0 0 16px;
        font-size: 14px;
        color: #666666;
      }
      input[type="checkbox"] {
        margin: 0 6px 0 0;
      }
      label {
        & + label {
          margin: 0 0 0 16px;
        }
      }
      .btn {
        background-color: #f54f4f;
        color: #fff;
        border: 0;
        width: 235px;
        height: 44px;
        line-height: 44px;
        border-radius: 5px;
        margin: 16px 0;
      }
    }
    .info {
      p:first-child {
        text-align: center;
        font-size: 24px;
        margin: 60px 0 40px 0;
        color: #7014f3;
        & + p {
          font-size: 14px;
          color: #666;
          text-align: center;
        }
      }
      .card {
        padding: 36px 100px;
        display: flex;
        flex-wrap: wrap;
        .item {
          box-sizing: border-box;
          padding: 16px;
          // flex: 0 0 50%;
          display: flex;
          a {
            flex: 0 0 40%;
            img {
              border-radius: 8px;
            }
          }
          .details {
            box-sizing: border-box;
            padding-left: 16px;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            .d1 {
              color: #333;
              font-size: 16px;
            }
            .d2 {
              // text-overflow: -o-ellipsis-lastline;
              // overflow: hidden;
              // text-overflow: ellipsis;
              // display: -webkit-box;
              // -webkit-line-clamp: 2;
              // line-clamp: 2;
              // -webkit-box-orient: vertical;
              line-height: 1.8;
              color: #878787;
              font-size: 14px;
              white-space: pre-line;
            }
          }
        }
      }
    }
  }
}
</style>
